.viewitem-container{
    display: inline-block;
    width: 400px;
    height: 420px;
    color: #6a6969;
    background-color: #f6f6f6;
    .viewitem-content{
        position: relative;
        width: 350px;
        height: 350px;
        background-color: #ffffff;
        border-radius: 20px;
        box-shadow: 0 6px 15px rgba(36, 37, 38, 0.08);
        transition: box-shadow 0.25s ease;
        cursor: pointer;
        .viewitem-content-title{
            position: absolute;
            left: 35px;
            top: 10px;
        }
        .viewitem-content-icon{
            position: absolute;
            right: 35px;
            top: 10px;
        }
        .viewitem-content-show{
            position: absolute;
            top: 50%;
            left: 50%;
            width: 250px;
            height: 250px;
            background-color: #c4a1db;
            border-radius: 50%;
            background-position:center;
            background-size: 200%;
            background-repeat: no-repeat;
            transform: translate(-50%,-50%);
        }

    }
    .viewitem-content:hover{
        box-shadow: 3px 8px 15px 5px rgba(36, 37, 38, 0.144);
    }
}